import React, { PureComponent, Fragment } from 'react';
import { Card, Row, Col, Modal } from 'antd';
import ReactDOM from 'react-dom';
// 插件
import moment from 'moment';

// 组件
import YqybAddFm from './YqybAddForm';
import TjfxQueryFm from './TjfxQueryForm';
import YqybTjfxTable from './YqybTjfxTable';

import { getAuthority } from '@/utils/authority';
import RenderAuthorized from '@/components/Authorized';
import { connect } from 'dva';
// 样式
import styles from './YqybTjfx.less';

const Authorized = RenderAuthorized(getAuthority());

@connect(({ maintain, config, loading }) => ({
  sjsbTbData: maintain.sjsbTbYqyb.data,
  sjsbTbSum: maintain.sjsbTbYqyb,
  loading: loading.effects['maintain/fetchGetQueryData'],
}))
class Tjfx extends PureComponent {
  constructor(props) {
    super(props);

    this.state = {
      total: 0,
    };
    this.dispatch = this.props.dispatch;

    this.user_id = sessionStorage.getItem('user_id');

    this.showAdd = this.showAdd.bind(this);
    this.handleCancel = this.handleCancel.bind(this);
  }

  componentDidMount() {
    this.GetQueryData();
  }

  // 数据上报-查询
  GetQueryData = ({
    year = parseInt(moment().format('YYYY')).toString(),
    department = '',
    brigdename = '',
    roadname = '',
  } = {}) => {
    this.dispatch({
      type: 'maintain/fetchYqybGetQueryData',
      payload: {
        year: year,
        department: department,
        brigdename: brigdename,
        roadname: roadname,
      },
      callback: response => {
        debugger
        if (response.ErrorMessage) {
          message.error.error('获取失败');
          console.log(response.ErrorMessage);
        }
        //保存查询条件
        var queryCon = {};
        queryCon['year'] = year;
        queryCon['department'] = department;
        queryCon['brigdename'] = brigdename;
        queryCon['roadname'] = roadname;
        this.setState({
          queryCon: queryCon,
        });
      },
    });
  };

  // 获取"养护单位"
  GetCompany = ({ type = null } = {}) => {
    this.dispatch({
      type: 'maintain/fetchGetCompany',
      payload: {
        type: type,
      },
      callback: response => {
        if (response.ErrorMessage) {
          message.error.error('获取失败');
          console.log(response.ErrorMessage);
        }
      },
    });
  };

  handleGetMap = e => {
    this.map = e;
  };

  //单击item
  clickItem(item) {
    var cLayer = this.pointsLayer;
    var m = this.refs.map;
    cLayer.eachLayer(function(l) {
      if (item.id == l.pointId) {
        l.openPopup();
        m.map.fitBounds(l.getBounds(), { maxZoom: 12 });
      }
    });
  }

  //显示add modal
  showAdd() {
    this.setState({
      showAddV: true,
      modalT: '新增',
    });
  }

  //不显示modal
  handleCancel(v) {
    var obj = {};
    obj[v] = false;
    this.setState(obj);
  }

  // 功能接口
  // 根据查询条件渲染表格

  render() {
    var s = this.state;
    const {} = this.props;
    const { sjsbTbData, sjsbTbSum } = this.props;
    return (
      <Fragment>
        <Card style={{ margin: '10px' }} bodyStyle={{ padding: 10 }}>
          <TjfxQueryFm
            parent={this}
            // yhdwList={yhdwList}
            queryCon={s.queryCon}
            GetQueryData={this.GetQueryData}
            showAdd={this.showAdd}
          />
        </Card>
        <Row>
          <Card
            title={
              <span style={{ borderLeft: '4px solid #3CB371', paddingLeft: '10px' }}>一桥一表</span>
            }
            className={styles.tableCard}
            // style={{ margin: '10px 5px 10px 10px' }}
          >
            <YqybTjfxTable
              sjsbTbData={sjsbTbData}
              sjsbTbSum={sjsbTbSum}
              queryCon={s.queryCon}
              GetQueryData={this.GetQueryData}
            />
          </Card>
        </Row>
        {s.showAddV ? (
          <Modal
            title={s.modalT}
            visible={true}
            onCancel={e => this.handleCancel('showAddV')}
            footer={null}
            bodyStyle={{ padding: 0 }}
            width={800}
          >
            <div className="modal_con_se">
              <YqybAddFm
                // yhdwList={p.yhdwList}
                parent={this}
                modalT={s.modalT}
                modalName={'showAddV'}
                handleCancel={this.handleCancel}
                GetQueryData={this.GetQueryData}
                queryCon={s.queryCon}
              />
            </div>
          </Modal>
        ) : null}
      </Fragment>
    );
  }
}

export default Tjfx;
